AJAX (Asynchronous JavaScript and XML) প্রযুক্তি ব্যবহার করে ওয়েব পেজে সার্ভার সাইড স্ক্রিপ্টের (যেমন PHP) মাধ্যমে ডেটা প্রক্রিয়া এবং রিটার্ন করা সম্ভব। AJAX রিকোয়েস্ট এবং PHP স্ক্রিপ্টের মধ্যে ইন্টারঅ্যাকশন ওয়েব পেজের কোনো অংশ রিলোড না করেই ডাইনামিক ডেটা লোড করতে সক্ষম করে।
AJAX ব্যবহার করে PHP স্ক্রিপ্টে রিকোয়েস্ট পাঠানো হয় এবং PHP স্ক্রিপ্ট সার্ভারে ডেটা প্রক্রিয়া করে রেসপন্স পাঠায়। AJAX এবং PHP এর এই ইন্টিগ্রেশন ওয়েব অ্যাপ্লিকেশনকে দ্রুত এবং ইন্টারঅ্যাকটিভ করে তোলে।
ধরা যাক, একটি PHP স্ক্রিপ্ট রয়েছে যার নাম process.php, এবং আপনি AJAX রিকোয়েস্টের মাধ্যমে PHP স্ক্রিপ্টকে ডেটা পাঠাবেন।
<?php
// ডেটা রিসিভ করা (AJAX থেকে)
if (isset($_POST['name'])) {
$name = $_POST['name'];
$response = "Hello, " . htmlspecialchars($name);
echo $response; // PHP রেসপন্স ফেরত পাঠানো
}
?>
এই স্ক্রিপ্টটি একটি POST রিকোয়েস্ট গ্রহণ করে, যেটির মাধ্যমে name নামক ভ্যারিয়েবল পাওয়া যাবে। সার্ভারে প্রক্রিয়া শেষে এটি "Hello, [name]" এমন একটি রেসপন্স পাঠাবে।
// XMLHttpRequest তৈরি করা
const xhr = new XMLHttpRequest();
// PHP স্ক্রিপ্টে POST রিকোয়েস্ট পাঠানোর জন্য
xhr.open('POST', 'process.php', true);
// হেডার সেট করা যাতে ডেটা পদ্ধতি সঠিকভাবে পাঠানো যায়
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
// রিকোয়েস্টের রেসপন্স পাওয়ার পরে এই ফাংশনটি চালানো হবে
xhr.onload = function() {
if (xhr.status === 200) {
// PHP রেসপন্স কনসোলে দেখানো
console.log(xhr.responseText); // রেসপন্স প্রদর্শন
} else {
console.error('Error:', xhr.status);
}
};
// পাঠানো ডেটা
const data = 'name=John Doe';
// রিকোয়েস্ট পাঠানো
xhr.send(data);
process.php ফাইলে $_POST['name'] এর মাধ্যমে নাম ডেটা গ্রহণ করা হয়। htmlspecialchars ফাংশন ব্যবহার করে ডেটাকে নিরাপদভাবে প্রক্রিয়া করা হয় এবং তারপর echo দিয়ে রেসপন্স পাঠানো হয়।xhr.open('POST', 'process.php', true); - এটি একটি POST রিকোয়েস্ট সেট করে যা process.php স্ক্রিপ্টে পাঠানো হবে। তারপর, xhr.send(data); এর মাধ্যমে name=John Doe ডেটা সার্ভারে পাঠানো হয়।AJAX থেকে প্রাপ্ত রেসপন্স ব্রাউজারে প্রদর্শন করা হয়। এখানে, PHP স্ক্রিপ্ট থেকে প্রাপ্ত "Hello, John Doe" রেসপন্স কনসোলে দেখানো হবে।
ধরা যাক, আপনি একটি ফর্ম ব্যবহার করে ইউজার ইনপুট গ্রহণ করছেন এবং AJAX এর মাধ্যমে সেই ইনপুট PHP স্ক্রিপ্টে পাঠাতে চান।
HTML ফর্ম:
<form id="userForm">
<input type="text" id="name" placeholder="Enter your name">
<button type="submit">Submit</button>
</form>
<div id="response"></div>
JavaScript (AJAX):
document.getElementById('userForm').addEventListener('submit', function(event) {
event.preventDefault(); // ফর্ম সাবমিট হওয়া থেকে রোধ করা
const name = document.getElementById('name').value;
const xhr = new XMLHttpRequest();
xhr.open('POST', 'process.php', true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.onload = function() {
if (xhr.status === 200) {
document.getElementById('response').innerHTML = xhr.responseText; // রেসপন্স ডিভে প্রদর্শন
} else {
console.error('Error:', xhr.status);
}
};
xhr.send('name=' + encodeURIComponent(name)); // ইনপুট নাম পাঠানো
});
PHP স্ক্রিপ্ট (process.php):
<?php
if (isset($_POST['name'])) {
$name = $_POST['name'];
$response = "Hello, " . htmlspecialchars($name);
echo $response; // রেসপন্স ফিরে পাঠানো
}
?>
এই উদাহরণে, ব্যবহারকারী যখন ফর্ম জমা দেয়, তখন ইনপুট নাম AJAX রিকোয়েস্টের মাধ্যমে PHP স্ক্রিপ্টে পাঠানো হয় এবং PHP স্ক্রিপ্টে সেটি প্রক্রিয়া করে রেসপন্স ব্রাউজারে প্রদর্শিত হয়।
AJAX এবং PHP ব্যবহার করে ওয়েব অ্যাপ্লিকেশনগুলো দ্রুত, ইন্টারঅ্যাকটিভ এবং ডাইনামিক হতে পারে। PHP স্ক্রিপ্টে ডেটা প্রক্রিয়া করার জন্য AJAX রিকোয়েস্ট পাঠানো হয় এবং সার্ভার থেকে প্রাপ্ত রেসপন্স ওয়েব পেজে প্রদর্শিত হয়। এটি পেজ রিলোড ছাড়াই ডেটা প্রক্রিয়া করতে সহায়তা করে, যা ইউজার এক্সপেরিয়েন্সকে উন্নত করে।
or
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
